<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
	<head>
		<title>个人信息</title>
		<link rel="stylesheet" href="/css/animate.min.css">
		<script src="/js/font_595888_1jlcfz62jg8vkj4i.js"></script>
		<%@include file="/WEB-INF/base.jspf"%>
		<style type="text/css">
			*{font-size: 16px;}
			li{height: 60px;line-height: 60px;border-top: 1px solid #f2f2f2;}
  			.div-c-spanTabs > div {
		    	flex:1;
		    	border:1px solid #cfd5d8; 
		    	display:block;
		    	border-top:none;
		    	border-right:none;
		    	padding:6px 4px;
		    	text-align: center;
		    	position: relative;
		    	cursor: pointer;
		    }
		    .div-c-spanTabs > div:after {
				content: "";
			    width: 100%;
			    height: 0;
			    border-bottom: 3px solid transparent;
			    position: absolute;
			    left: 0;
			    bottom: 0;
			    transition: all 0.3s;	    
		    }		    
		    .div-c-spanTabs > div.active:after {
			    border-bottom: 3px solid #059BF3;
		    }	
		    .tabContent {
		    	display:none;
		    	padding-top:10px;
		    }
		    .tabContent.active {
		    	display:block;
		    }		 
		.dataTables_wrapper .dataTables_paginate {
			float: none;
			text-align:center;
		}
		.dataTables_wrapper .dataTables_info {
			float: none;
		}   		
		.btn-c-signInBtn.cantqiandao {
			background-color: #fbcb96!important;
		}
		#table_id_example, #table_id_example th, #table_id_example td {
			border:none!important;
		}
		.table>thead>tr>th {
			text-align: center;
		}
		.tool-bar {
				position: absolute;
				top:5%;
				display:flex;
				justify-content:space-between;
				z-index:2;
				width:100%;
				max-width:690px;
			}
			.tool-bar > a {
				color:white;
				border-radius: 18px;
				padding: 0.3rem;
				font-size:0.4rem;
				background:rgba(0,0,0,.5);
			}
	.signRule{
		margin-top:60px;
		margin-left:10px;
	}
		</style>
	</head>

	<body>
		<div class="col-xs-12 col-sm-4 col-sm-offset-4 text-center bg-theme" style="height: 50px;line-height:50px;position: fixed;margin-top: 0px;left: 0px;z-index: 100;">
			<a onclick="back()" class="glyphicon glyphicon-chevron-left" style="cursor:pointer;color: white;font-size: 20px;position: absolute;top:50%;left:10px;transform:translateY(-50%);"></a>
			<strong style="font-size: 20px;color: white;">每日签到</strong>
		</div>
		<div class="col-xs-12 col-sm-4 col-sm-offset-4 text-center" style="padding:0;">
			<div style="height: 50px;" class="br"></div>
			<div class="div-c-spanTabs" style="display:flex;">
				<div class="active" data-index="1">今日签到</div>
				<div data-index="2">历史签到</div>
			</div>
			<div class="div-c-tabContentWrapper">
				<div class="tabContent active tabContent1" style="padding-top:40px;">
					<p style="font-weight:bold;" class="p-c-daySignNoticeText">每日签到，领取现金红包！</p>
					<span class="btn-c-signInBtn" style="width:160px;letter-spacing: 10px;padding:8px 10px;padding-left:22px;display:inline-flex;background-color:#ff8500;justify-content:center;color:white;border-radius: 6px;cursor: pointer;font-weight:bold;">签到</span>			
				</div>
				<div class="tabContent tabContent2">	
					<table id="table_id_example" class="table table-striped table-bordered" style="">
						<thead>
							<tr>
								<th>签到时间</th>
								<th>领取金额</th>
							</tr>
						</thead>
						<tbody>
						</tbody>
					</table>		
				</div>				
			</div>
		</div>
		 <div class="tool-bar">
			 <a class="signRule" href="javascript:;" style="border-top-right-radius:0;border-bottom-right-radius:0;">签到规则</a>
		</div>
<div class="modal-div-fakeModal" id="div-i-noticeGenDan2">
	<div class="div-c-modalContent">
		<h3 class="fakemodal-title">签到成功！</h3>
		<div class="fakemodal-content">
			<p><span style="font-weight:bold;">签到所得金额：</span><span id="span-i-signGetMoney" style="color:red;font-weight:bold;"></span>元</p>
			<!-- <p><span style="font-weight:bold;">当前账号余额：</span><span id="span-i-signCurrentMoney" style="color:red;font-weight:bold;"></span>元</p> -->
		</div>
		<div class="fakemodal-btnsGroup"><button class="btn btn-default btn-class-closeFakeModal">关闭</button></div>
	</div>
</div>		

<div class="modal-div-fakeModal" id="div-i-noticeGenDan">
	<div class="div-c-modalContent">
		<h3 class="fakemodal-title"></h3>
		<div class="fakemodal-content"></div>
		<div class="fakemodal-btnsGroup"><button class="btn btn-default btn-class-closeFakeModal">关闭</button></div>
	</div>
</div>			
	</body>
	<script type="text/javascript">
	$(function(){
		$('.signRule').on('click',findLuckyRul);
	
	});
function findLuckyRul(){
	$.post('/explains/findByIdExplain.do',{id:1},function(result){
		var data = result.data;
		showAlertNotice("签到说明", result.data.sign_explain, "")
	});
}
	
	$.ajax({
		type:"post",
		url: "/u/signInFlag.do",
		dataType:"json",
		data:{},
		success:function(data){
			if (data.message == "今天已经签到了,请明天在来!") {
				$(".btn-c-signInBtn").text("已签到").addClass("cantqiandao")
			}
		},
		error: function(e) {
			showNormalNoticeModal("#div-i-noticeGenDan", "提示：", "网络繁忙")
		}
	})	
	$(".btn-c-signInBtn").on(getEndClickEvent(), function(e) {
		if ($(e.currentTarget).hasClass("cantqiandao")) {
			return
		}
		if ("${user.state}" === "2") {
			showNormalNoticeModal("#div-i-noticeGenDan", "提示：", "试玩账号无法签到，请注册为正式会员")
			return
		}
 		$.ajax({
			type:"post",
			url: "/u/signInUser.do",
			dataType:"json",
			data: {},
			success:function(data){
				if (data.message == "恭喜您！签到成功！") {
					$("#span-i-signGetMoney").text(data.data.bdjine)
				/* 	$("#span-i-signCurrentMoney").text(data.data.bdhjine)	 */				
					showFakeModal("#div-i-noticeGenDan2")
					$(".btn-c-signInBtn").text("已签到").addClass("cantqiandao")
				}
				else {
					showNormalNoticeModal("#div-i-noticeGenDan", "提示：", data.message)
				}

			},
			error: function(e) {
				showNormalNoticeModal("#div-i-noticeGenDan", "提示：", "网络繁忙")
			}
		})
	})
	
		//showNormalNoticeModal("#div-i-noticeGenDan", "提示：", json.data)
		$(".div-c-spanTabs div").on(getEndClickEvent(), function(e) {
			var $self = $(e.currentTarget)
			var index = $self.attr("data-index")
			$self.siblings().removeClass("active")
			$self.addClass("active")
			var contentWrapper = $self.parent().next()
			contentWrapper.find(".tabContent.active").eq(0).removeClass("active")
			contentWrapper.find(".tabContent" + index).eq(0).addClass("active")
			if (index === "2") {
				$("#table_id_example").DataTable().ajax.reload()
			}
		})		
	$("#table_id_example").DataTable({
	      // "bPaginate": true,
	      "bLengthChange": true,      
	      "bSort": false,
	      // "bInfo": true,
	      "bAutoWidth": false,
	      "scrollCollapse": true,	      
	      //"dom": `ft<"tableToolBar" p<"lengthWrapper" l>i>`,
	      "dom": 't<"toolbar" pi>',
//	         "bServerSide":true,
	      'aLengthMenu':[10],
	       "searching": true,  
	      "stateSave": true,
	      "stateDuration": 365,
 	         "columns": [
	                     { "data": "createtime" },
	                     { "data": "bdjine", "className": "bdjine-td" },
	                 ],	 
 	      "ajax": {
    	  	  "type": 'POST',
    	      "url":"/u/record.do", 
     	      "dataSrc": function(json) {
    	    	 for (var i = 0; i < json.data.length; i++) {
    	    		 var item = json.data[i]
    	    		 item.bdjine = String(item.bdjine) + "元"
    	    	 }
    	    	 return json.data
    	      } 
	      },	
//	    "searching": true,l
	       "language": {//语言设置  
	            "zeroRecords": "暂无签到记录",     
	            "sInfo": "第 _PAGE_ / _PAGES_ 页",     
	            "info": "没有数据",     
	            "oPaginate": {     
	                "sFirst": "首页",     
	                "sPrevious": "上一页",     
	                "sNext": "下一页",     
	                "sLast": "尾页"    
	          	},
	            "search":"",
	            "searchPlaceholder": "请输入关键字",
	            "infoFiltered":   "",
	            "infoEmpty":      "",
	         }
	    })		
	</script>
</html>